<template>
	<section class="scholl border-box bg-white" >
		<ul class="pt30rem pr30rem pl30rem">
			<li class="border-b pb10rem mb20rem" v-for="item in data_list">
				<div class="mb5">
					<strong class="bold">
						{{item.name}}
					</strong>
					<i  class="iconfont icon-xingxing star-default fs28rem" 
						v-for="(n,i) in 5"						
						:class="{'active': i < item.judge_star}"
					></i>
				</div>
				<div class="mb10rem">
					{{item.content}}
				</div>
				<div class="show-img">
					<img
						v-for="src in item.img" 
						:src="img_url+src" alt="评论图片">
				</div>
				
			</li>
		</ul>			
	</section>
</template>

<script>
	import { userexEvaluateList } from '@/api/ordering';

	export default {		
		data() 
		{
			return{
				img_url: process.env.IMG_URL,
				data_list: [],
				params:{
					uid: localStorage.getItem('uid'),
					goods_id: this.$route.query.goods_id,
					judge_id: this.$route.query.judge_id			
				}				
			}
		},
		methods:
		{
			loadData()
			{
				userexEvaluateList(this.params).then( res => {
					this.data_list = res.data;
				});
			}
				
		},		
		created()
		{
			this.loadData();
			var test = this.$route.query.judge_id;
			//console.log(typeof(test));

		}		
	}
	
</script>

<style lang="less">
	.border-box{
		box-sizing: border-box;
		.show-img{
			img{
				display: inline-block;
				width: 160/28rem;
				height: 6rem;
				margin-right: 5px;
				object-fit: cover;
			}
		}
		.icon-xingxing{
			}
			.star-default{
				color: #d6d6d6;
			}
			.active{
				color: #FB8E01 !important;
			}
		
	}
	.border-box * {
		box-sizing: border-box;
	}
	
	
</style>

